<template>
    <el-dialog :model-value="dialogVisible" :title="type == 'add' ? '新增' : '编辑'" width="600px"
        :before-close="handleClose" append-to-body>
        <el-form ref="formRef" :model="dataForm" label-width="100px" :rules="rules" :inline="false">
            <el-form-item label="科目名称：" prop="categoryName">
                <el-input v-model="dataForm.categoryName" placeholder="请输入" clearable />
            </el-form-item>
            <el-form-item label="科目编码：" prop="categoryCode">
                <el-input v-model="dataForm.categoryCode" placeholder="请输入" clearable />
            </el-form-item>
            <el-form-item label="状态：" prop="enabled">
                <el-select v-model="dataForm.enabled" style="width:100%">
                    <el-option v-for="item in STATUS_LIST" :key="item.value" :label="item.label" :value="item.value" />
                </el-select>
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button type="primary" @click="submit()">确定</el-button>
                <el-button @click="handleClose">取消</el-button>
            </span>
        </template>
    </el-dialog>
</template>
<script setup>
import api from "@/api/index";
import { ElMessage, ElMessageBox } from 'element-plus'
import { STATUS_LIST, CONMPAYN_PROPS } from './config'
import { useUserStore } from '@/store/index'
const props = defineProps({
    dialogVisible: {
        type: Boolean,
        default: false
    },
    type: {
        default: 'add',
        type: String
    },
    dataForm: {
        type: Object,
        default: () => { }
    },
    treeDatas: {
        type: Array,
        default: () => []
    }


})



const peopleList = ref([])

const userStore = useUserStore()

const categoryCodeValidate = (rule, value, callback) => {
    let reg = new RegExp(/^.{2,20}$/)
    if (!reg.test(value)) {
        return callback(new Error('请输入2-20位编码'))
    } else {
        callback()
    }
}

const rules = reactive({
    path: [
        {
            required: true,
            message: '请选择',
            trigger: 'blur'
        }
    ],
    categoryName: [
        {
            required: true,
            message: '请输入',
            trigger: 'blur'
        }, {
            min: 2, max: 50, required: true,
            message: '请输入2-50个字符',
            trigger: 'blur'
        }
    ],
    categoryCode: [
        {
            required: true,
            trigger: 'blur',
            validator: categoryCodeValidate,
        },

    ],
    enabled: [
        {
            required: true,
            message: '请选择',
            trigger: 'blur'
        }
    ],
})



const formRef = ref(null)

const emit = defineEmits(['on-update', 'handleClose'])


// 关闭
const handleClose = () => {
    formRef.value.resetFields()
    formRef.value.clearValidate()
    emit('handleClose')

}

const submit = () => {
    if (!formRef) return
    formRef.value.validate(valid => {
        if (valid) {
            const obj = {
                'add': 'budgetSubjectAdd',
                'edit': 'budgetSubjectEdit'
            }
            let data = {
                ...props.dataForm
            }
            data['orgCode'] = userStore.userInfo.departmentVo.departmentId
            api.budgetConfig[obj[props.type]](data).then(res => {
                emit('on-update')
                handleClose()
                ElMessage.success('操作成功')
            })

        } else {
            console.log('error submit!')
            return false
        }
    })
}


</script>
